@charset "utf-8";

//=== Inverted navbar
// Reset inverted navbar basics
$navbar-metalab-color: #000 !default;
$navbar-metalab-bg: #fff !default;
$navbar-metalab-border: #1f86ed !default;

// Inverted navbar links
$navbar-metalab-link-color: #000 !default;
$navbar-metalab-link-hover-color: lighten(#000, 15%) !default;
$navbar-metalab-link-hover-bg: transparent !default;
$navbar-metalab-link-active-color: $navbar-metalab-link-hover-color !default;
$navbar-metalab-link-active-bg: darken($navbar-metalab-bg, 10%) !default;
$navbar-metalab-link-disabled-color: #444 !default;
$navbar-metalab-link-disabled-bg: transparent !default;

// Inverted navbar brand label
$navbar-metalab-brand-color: $navbar-metalab-link-color !default;
$navbar-metalab-brand-hover-color: #fff !default;
$navbar-metalab-brand-hover-bg: transparent !default;

// Inverted navbar toggle
$navbar-metalab-toggle-hover-bg: lighten($navbar-metalab-border, 15%) !default;
$navbar-metalab-toggle-icon-bar-bg: $navbar-metalab-border !default;
$navbar-metalab-toggle-border-color: $navbar-metalab-border !default;

.navbar-metalab {
    background-color: $navbar-metalab-bg;
    border-bottom: 1px $navbar-metalab-border solid;
    border-radius: 0px;
    margin-bottom: 0;

    .navbar-brand {
        color: $navbar-metalab-brand-color;
        &:hover,
        &:focus {
            color: $navbar-metalab-brand-hover-color;
            background-color: $navbar-metalab-brand-hover-bg;
        }
    }

    .navbar-text {
        color: $navbar-metalab-color;
    }

    .navbar-nav {
        > li > a {
            color: $navbar-metalab-link-color;

            &:hover,
            &:focus {
                color: $navbar-metalab-link-hover-color;
                background-color: $navbar-metalab-link-hover-bg;
            }
        }
        > .active > a {
            &,
            &:hover,
            &:focus {
                color: $navbar-metalab-link-active-color;
                background-color: $navbar-metalab-link-active-bg;
            }
        }
        > .disabled > a {
            &,
            &:hover,
            &:focus {
                color: $navbar-metalab-link-disabled-color;
                background-color: $navbar-metalab-link-disabled-bg;
            }
        }
    }

    // Darken the responsive nav toggle
    .navbar-toggle {
        border-color: $navbar-metalab-toggle-border-color;
        &:hover,
        &:focus {
            background-color: $navbar-metalab-toggle-hover-bg;
        }
        .icon-bar {
            background-color: $navbar-metalab-toggle-icon-bar-bg;
        }
    }

    .navbar-collapse,
    .navbar-form {
        border-color: darken($navbar-metalab-bg, 7%);
    }

    // Dropdowns
    .navbar-nav {
        > .open > a {
            &,
            &:hover,
            &:focus {
                background-color: $navbar-metalab-link-active-bg;
                color: $navbar-metalab-link-active-color;
            }
        }

        @media (max-width: $grid-float-breakpoint-max) {
            // Dropdowns get custom display
            .open .dropdown-menu {
                > .dropdown-header {
                    border-color: $navbar-metalab-border;
                }
                .divider {
                    background-color: $navbar-metalab-border;
                }
                > li > a {
                    color: $navbar-metalab-link-color;
                    &:hover,
                    &:focus {
                        color: $navbar-metalab-link-hover-color;
                        background-color: $navbar-metalab-link-hover-bg;
                    }
                }
                > .active > a {
                    &,
                    &:hover,
                    &:focus {
                        color: $navbar-metalab-link-active-color;
                        background-color: $navbar-metalab-link-active-bg;
                    }
                }
                > .disabled > a {
                    &,
                    &:hover,
                    &:focus {
                        color: $navbar-metalab-link-disabled-color;
                        background-color: $navbar-metalab-link-disabled-bg;
                    }
                }
            }
        }
    }

    .navbar-link {
        color: $navbar-metalab-link-color;
        &:hover {
            color: $navbar-metalab-link-hover-color;
        }
    }

    .btn-link {
        color: $navbar-metalab-link-color;
        &:hover,
        &:focus {
            color: $navbar-metalab-link-hover-color;
        }
        &[disabled],
        fieldset[disabled] & {
            &:hover,
            &:focus {
                color: $navbar-metalab-link-disabled-color;
            }
        }
    }

    @media(min-width: $screen-md-min) {
        .sign-up {
            margin: 0;
        }
    }
}
